<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        ul {
            cursor: pointer;
            list-style: none;
        }
    </style>
</head>

<body>
    <input type="button" value="创建列表" id="btn">

    <div id="dv"></div>

    <script src="common.js"></script>

    <script>
        var arr = [{
                name: "百度",
                href: "http://www.baidu.com"
            },
            {
                name: "谷歌",
                href: "http://www.google.com"
            },
            {
                name: "优酷",
                href: "http://www.youku.com"
            },
            {
                name: "土豆",
                href: "http://www.tudou.com"
            },
            {
                name: "快播",
                href: "http://www.kuaibo.com"
            },
            {
                name: "爱奇艺",
                href: "http://www.aiqiyi.com"
            }
        ];

        my$("btn").onclick = function () {
            var tableObj = document.createElement("table");
            my$("dv").appendChild(tableObj);
            for (i=0;i<arr.length;i++){
                var dt=arr[i];
                var trObj=document.createElement("tr");
                tableObj.appendChild(trObj);
                var td1=document.createElement("td");
                td1.innerText=dt.name;
                trObj.appendChild(td1);
                var td2=document.createElement("td");
                td2.innerHTML="<a href="+dt.href+">"+dt.name+"</a>";
                trObj.appendChild(td2);
            }
        }
    </script>

</body>

</html>